<template>
  <div class="homeNavHot">
    <section>
      <div class="homeNavHotTitle">
        <img src="../../assets/icon/1537964399143.jpg" alt />
      </div>
      <forBranch v-for="(item, index) in arrAll" :key="index" :arr="item"></forBranch>
    </section>
  </div>
</template>

<script>
import forBranch from "../for-branch/homeForBranch.vue";

export default {
  name: "homeNavHot",

  components: {
    forBranch
  },

  data() {
    return {
      arrAll: [
        [
          { url: { path: "/ProductList", query:{ id: "3847412cd8254099aab71f286db1f171" } }, src: require("../../assets/icon/1583309405279.jpg") },
          { url: { path: "/ProductList", query:{ id: "a6e6988063b84bdf8a443f5916bb1595" } }, src: require("../../assets/icon/1583309409914.jpg") },
          { url: { path: "/ProductList", query:{ id: "85199e9d0f614698972344a17ad2a7bf" } }, src: require("../../assets/icon/1583309414494.jpg") },
          { url: { path: "/ProductList", query:{ id: "a1f2f1d4dd214052bdd650a47527753a" } }, src: require("../../assets/icon/1583309435733.jpg") }
        ],
        [
          { url: { path: "/ProductList", query:{ id: "08b1bf6dc1434c34a1355244b922e7c1" } }, src: require("../../assets/icon/1583309447209.jpg") },
          { url: { path: "/ProductList", query:{ id: "2ed95be7daef442bbcbfed3553a10e53" } }, src: require("../../assets/icon/1583309452232.jpg") },
          { url: { path: "/ProductList", query:{ id: "a79f2fa562104fb09cca1de6babcd02b" } }, src: require("../../assets/icon/1583309456674.jpg") },
          { url: { path: "/ProductList", query:{ id: "713a5105f16c4733aa0171bc3a6721b9" } }, src: require("../../assets/icon/1583309464945.jpg") }
        ]
      ]
    };
  }
};
</script>

<style scoped>
.homeNavHot ul{
  overflow: hidden;
}

.homeNavHotTitle {
  width: 100%;
}

.homeNavHotTitle img {
  display: block;
  width: 100%;
}
</style>